<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/common/jsp/declare.jsp" %>

<!DOCTYPE html>
<html>
<head>
	<base href="<%=basePath %>" />
	<title>订单-编辑</title>
	<%@ include file="/common/jsp/common.jsp" %>

	<script>
	var serviceFee = ${!empty serviceFee ? serviceFee : 0};
	</script>
</head>
<body id="order" class="bg-grey">
	<div class="picBar">
		<img src="aizu/images/room/room.jpg" />
	</div>
	<div class="address">地址：${address }</div>
	<div class="room">房间名称：${roomName }</div>
	<c:if test="${!empty bedName }">
	<div class="room">床位名称：${bedName }</div>
	</c:if>
	<form action="mvc/renter/saveOrder.htm" method="post">
		<input type="hidden" name="fromUserName" value="${param.fromUserName }" />
		<input type="hidden" name="communityId" value="${communityId }" />
		<input type="hidden" name="roomId" value="${roomId }" />
		<input type="hidden" name="bedId" value="${bedId }" />
		<table border="0" cellspacing="0" borderColor="#DADADA">
			<thead>
				<tr>
					<th width="50%">时间选择</th>
					<th width="50%">服务费<font color="red">(5元/月)</font></th>
				</tr>
			</thead>
			<tbody>
				<tr>
					<td>
						<div name="tenancy" value="1" class="select middle" data='[{name:"1月",value:"1"},{name:"2月",value:"2"},{name:"3月",value:"3"},{name:"4月",value:"4"},{name:"5月",value:"5"},{name:"6月",value:"6"},{name:"7月",value:"7"},{name:"8月",value:"8"},{name:"9月",value:"9"},{name:"10月",value:"10"},{name:"11月",value:"11"},{name:"12月",value:"12"}]'
							modal="false" option="{notnull:true,onselect:function(select,op){
								$('.tenancy').text(op.value);
								$('#serviceFee').text(serviceFee * op.value);//服务费
								$('#rental').text(${rental } * op.value);//租金
	
								var deposit = parseFloat($('#deposit').text());
								$('#unitPrice').text(${rental } + serviceFee + deposit);//单价 = 租金 + 服务费 + 押金
								$('#totalPrice').text(parseFloat($('#rental').text()) + parseFloat($('#serviceFee').text()) + deposit);//总价 = 总租金 + 总服务费 + 押金
							}}" defaultText="租期">
						</div>
					</td>
					<td><fmt:formatNumber value="${serviceFee }" pattern="###0.#"/>*<span class="tenancy">1</span>=<span id="serviceFee">${serviceFee }</span></td>
				</tr>
			</tbody>
			<thead>
				<tr>
					<th width="50%">租金</th>
					<th width="50%">押金</th>
				</tr>
			</thead>
			<tbody>
				<tr>
					<td><fmt:formatNumber value="${rental }" pattern="###0.#"/>*<span class="tenancy">1</span>=<span id="rental">${rental }</span></td>
					<td id="deposit"><fmt:formatNumber value="${deposit * rental }" pattern="###0.#"/></td>
				</tr>
			</tbody>
			<tfoot>
				<tr>
					<th colspan="2">
						<table border="0" cellspacing="0" borderColor="#DADADA">
							<tr>
								<td width="50%">单价:<span id="unitPrice"></span></td>
								<td width="50%">总价:<span id="totalPrice"></span></td>
							</tr>
						</table>
					</th>
				</tr>
			</tfoot>
		</table>
		<input type="submit" value="提交订单" class="submit-order" />
	</form>
</body>
</html>